<template>
<div class="contain">
  <header class="hd-top">
    <span class="iconfont icon-left" @click="goBack"></span>
    <h2 class="title">我的商品</h2>
    <button class="btn" @click="addGoods(1)">新增</button>
  </header>
  <div class="page">
    <div class="displayflex top-bar-w">
      <div class="top-bar-c flex1">
        <i class="iconfont icon-sech"></i>
        <div class="ipt"><input type="text" placeholder="输入商品名称" v-model="name"></div>
      </div>
      <div class="btn-sech" @click="getdata">搜索</div>
    </div>
    <scroller lock-x height="-96" @on-scroll-bottom="onScrollBottom" ref="scrollerBottom" :scroll-bottom-offst="100" v-if="todolist.length>0">
    <div>
      <div v-for="item in todolist">
        <div class="goods-box displayflex" @click="addGoods(2,item)">
          <div class="pic" v-if="item.PictContent && item.PictContent!='null'"><img :src="item.PictContent | filterImgUrl"></div>
          <div class="pic" v-else><img src="~images/icon/none.png"></div>
          <div class="flex1 txt">
            <p class="tit ft17">{{item.GoodsName}}</p>
            <p>{{item.MinUnitQty}}/{{item.MinUnitStyle}}</p>
            <p>{{item.Producer}}</p>
          </div>
        </div>
      </div>
    </div>
    </scroller>
    <div class="no-data" v-if="todolist.length==0">
      <img src="~images/icon/nodata.png">
      <p class="txt ft17">暂无数据</p>
    </div>
  </div>
  <div class="btn-bottom"><div class="btn" @click="addGoods(1)">新增</div></div>
</div>
</template>

<script>
export default {
  data(){
    return{
      todolist:[],
      name:''
    }
  },
  computed:{
    userinfo(){
      if(localStorage.UserInfo){
        return JSON.parse(localStorage.UserInfo)
      };
    },
  },
  watch:{
    name(val){
      if(val==""){
        this.getdata();
      };
    }
  },
  created(){
    this.getdata();
  },
  methods:{
    goBack(){
      this.$router.go(-1)
    },
    addGoods(type,value){
      if(value){
        sessionStorage.usersgoodsItem = JSON.stringify(value);
      }
      this.$router.push({
        path:'/user/addGoods',
        query:{
          type:type
        }
      });
    },
    getdata() {
      var _this = this;
      var query = {
        CreateUserId : this.userinfo.StaffID,
        PageSize: 8,
        PageIndex: 0,
        GoodsName:this.name
      };
      this.Ajax.post("SearchGoods", query).then(function(resp) {
        _this.todolist = resp.Datas;
      });
    },
    onScrollBottom () {
      // if (this.onFetching > 0) {
      //   // do nothing
      // } else {
      //     this.onFetching ++;
          console.log("请求")
          this.$nextTick(() => {
            this.$refs.scrollerBottom.reset()
          })
      // }
    },
  }
}
</script>